<template>
	<div class="goods-detail border-b20 full-width">
		<section class="layout-around border-b">
			<span class="c666 w50 align-center pt15 pb15 detial pos-rel" :class="{ subject : view == 0}" @click="showView(0)">详情</span>	
			<span class="c666 w50 align-center pt15 pb15" :class="{ subject : view == 1}" @click="showView(1)">进度</span>
		</section>
		<section v-show=" view == 0" v-if="data.goods">
			<div v-html="data.goods.description" class="mt15 mb15 container bg-white description"></div>
		</section>
		<section v-show=" view == 1">
			<ul class="row"> 
				<li class="layout-juscon pt20 auto w92" v-for="items in schedule_data">
					<div class="li-left mr20">
						<p class="fs14 black">{{ items.date }}</p>
						<span class="fs12 c666">{{ items.time }}</span>
					</div>
					<div class="li-right flex_1 border-b pb20">
						<p class="fs14 c666"><i style="color:#ff7b1a;">[{{ items.title }}]</i>{{ items.tag }}</p>
						<ul>
							<li class="col s4 align-center pl10 pr10" v-for="item in items.pics">
								<img class="responsive-img" :src="item" alt="">
							</li>
						</ul>
					</div>
				</li>
			</ul>
		</section>
	</div>
</template>

<script>
	export default{
		name: 'Goods-detail',
		props:{
			data: {
				type: [ Array,Object ]
			},
			schedule_data : {
				type: [ Array,Object ]
			}
		},
		data()
		{
			return{
				view : 0
			}
		},
		methods:
		{
			showView(num)
			{
				this.view = num;
			}
		}
	}
</script>

<style lang="less">
	.goods-detail{
		.detial:after{
			content:'';
			width: 1px;
			height: 15px;
			background-color: #cecece;
			position: absolute;
			right: 0;
			top: 50%;
			transform: translate(50%,-50%;);
		}
		.row{
			li{
				&:last-child{
					.li-right{
						border-bottom:none;
					}
				} 
			}
		}
		.description{
			img{
				width: 100%;
			}
		}
	}
</style>








